/*
 * @Author       : NaN 353362604@qq.com
 * @Date         : 2023-01-12 09:35:49
 * @LastEditTime : 2023-06-01 11:16:19
 * @LastEditors  : NaN 353362604@qq.com
 * @FilePath     : \AdminStration\src\Common\Router\MenuNav\module\TreeSelectModule.jsx
 * @Description  :
 */

import { Button, Tree, Spin, message } from 'antd'
import { useRequest, useBoolean } from 'ahooks'
import { useEffect, useState } from 'react'
import { Http } from '../../../Api'

export const TreeSelectModule = ({ TableListData, router }) => {
    const [TreeData, setTreeData] = useState()
    const [TreeSelectData, setTreeSelectData] = useState()
    const [HalfCheckedKeys, setHalfCheckedKeys] = useState([])
    const [loading, { setTrue, setFalse }] = useBoolean(true)
    const [TableListParament, setTableListParament] = useState()
    const { runAsync: posRolesMenus } = useRequest(Http, { manual: true })
    const { runAsync: getRolesMenus } = useRequest(Http, {
        manual: true,
        onSuccess: res => {
            setTreeSelectData(res)
            setFalse()
        },
    })
    const { runAsync: getMenuWebTree } = useRequest(Http, {
        manual: true,
        onSuccess: res => {
            setTreeData(res)
            getRolesMenus({
                url: TableListParament.get,
                data: { RoleUuid: TableListParament.uuid },
                path: [TableListParament.uuid],
            })
        },
    })

    // useEffect(() => {
    //     getMenuWebTree({ url: getMenu })
    // }, [getMenu, getMenuWebTree])

    const onSubmit = () => {
        setTrue()
        posRolesMenus({
            url: TableListParament.pos,
            data: [...TreeSelectData, ...HalfCheckedKeys],
            path: [TableListParament.uuid],
        }).then(() => {
            message.success('权限修改成功!')
            setFalse()
        })
    }

    useEffect(() => {
        const { page, ...res } = TableListData
        const ClientData = JSON.parse(localStorage.getItem('ClientData'))
        const getProList = async () => {
            const Template = await import(`../${router}/${page}`).catch(() => false)
            const tableData = await Template[page]({ ...res, ClientData })
            getMenuWebTree({ url: tableData.getMenu })
            setTableListParament(tableData)
        }
        if (page) getProList()

        console.log(TableListData)
    }, [TableListData, getMenuWebTree, router])

    return (
        <>
            {TreeSelectData && TreeData && (
                <Spin spinning={loading}>
                    <div className="Box">
                        <Tree
                            checkable
                            checkedKeys={TreeSelectData}
                            fieldNames={{ title: 'tableName', key: 'uuid' }}
                            onCheck={(e, { halfCheckedKeys }) => {
                                setTreeSelectData(e)
                                setHalfCheckedKeys(halfCheckedKeys)
                            }}
                            treeData={TreeData}
                        />
                        <div className="TreeButton">
                            <Button type="primary" onClick={onSubmit}>
                                保存
                            </Button>
                        </div>
                    </div>
                </Spin>
            )}
        </>
    )
}
